<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>

    <script id='bootscript' src="../dist/1.0.0/boot.innerPage.min.js"></script>



</head>

<body class="bg_f3" id="">

    <div id="banner-wrap">

        <span class="each-barner">
            <i class="fa fa-home ft-16"></i>&nbsp;
            <span>首页</span>
        </span>

        <span class="each-barner">
            <i class="fa fa-book ft-16"></i>&nbsp;
            <span>子页面</span>
        </span>

        <span class="each-barner">
            <i class="fa fa-bar ft-16"></i>&nbsp;
            <span>正在进行的页面</span>
        </span>

    </div>

    <div class="sc-container sc-formpage clearfix" id="app">

        <div id="title-wrap">

            <div class="fl">
                <span class="title">模块名称</span>
                <span class="sub-title">子模块</span>
            </div>

            <div class="fr">
                <i class="fa fa-car">&nbsp;</i>&nbsp;
                <i class="fa fa-dashboard">&nbsp;</i>
            </div>


        </div>

        <div id="top-tips-wrap">
            <i class="fa fa-info-circle yellow"></i>
            <span>说明区域,说明区域...</span>
        </div>

        <div id="tools-wrap">

            <div class="fr tool-right">
                <button type="button" class="ivu-btn ivu-btn-primary">
                <span>新增</span>
                </button>

                <button type="button" class="ivu-btn"><span>取消</span></button>

                <button type="button" class="ivu-btn"><span>重置</span></button>

                <button type="button" class="ivu-btn toggleWidget"><span>折叠切换</span></button>

            </div>

        </div>

        <div id="list-top-wrap">
            <span>共统计企业总数</span>
        </div>

        <div id="form-wrap" class="form-wrap clearfix">

            <div class="fl form-left">
                <div class="line"></div>
            </div>

            <div class="fl  form-right">

                <div class="widget flat clearfix">
                    <div class="widget-header lined">

                        <div class="foreIcon">
                            <i class="fa fa-check-circle yellow"></i>
                        </div>

                        <div class="widget-caption clearfix">
                            <span class="title">单栏表单</span>
                            <span class="color-999 state-key">状态:</span>
                            <span class="color-52ec54 state-value">已填报</span>
                        </div>

                        <div class="widget-buttons">
                            <a href="#" data-toggle="collapse"><i class="fa fa-angle-up"></i></a>
                        </div>

                    </div>
                    <div class="widget-body clearfix">
                        内部自行填充
                    </div>
                </div>

                <div class="widget flat clearfix">
                    <div class="widget-header lined">
                        <span class="foreIcon">
                    <i class="fa fa-check-circle blue"></i>
                </span>

                        <div class="widget-caption">
                            <span class="title">单栏表单</span>
                            <span class="color-999 state-key">状态:</span>
                            <span class="color-ffad50 state-value">未填报</span>
                        </div>

                        <div class="widget-buttons">
                            <a href="#" data-toggle="collapse"><i class="fa fa-angle-up"></i></a>
                        </div>
                    </div>
                    <div class="widget-body clearfix">
                        <i-form :label-width="150">

                            <i-row>
                                <i-col span="12">
                                    <Form-Item label="用户代码:">
                                        <i-input placeholder="请输入"></i-input>
                                    </Form-Item>
                                </i-col>
                                <i-col span="12">
                                    <Form-Item label="用户代码:">
                                        <i-input placeholder="请输入"></i-input>
                                    </Form-Item>
                                </i-col>
                            </i-row>

                            <i-row>
                                <i-col span="12">
                                    <Form-Item label="用户代码:">
                                        <i-select v-model="formItem.select" placeholder="请选择">
                                            <i-option value="beijing">北京市</i-option>
                                            <i-option value="shanghai">上海市</i-option>
                                            <i-option value="shenzhen">深圳市</i-option>
                                        </i-select>
                                    </Form-Item>
                                </i-col>
                                <i-col span="12">
                                    <Form-Item label="用户代码:">
                                        <i-select v-model="formItem.select" placeholder="请选择">
                                            <i-option value="beijing">北京市</i-option>
                                            <i-option value="shanghai">上海市</i-option>
                                            <i-option value="shenzhen">深圳市</i-option>
                                        </i-select>
                                    </Form-Item>
                                </i-col>
                            </i-row>


                            <Form-Item label="经纬度">
                                <i-row>
                                    <i-col span="11">
                                        <Form-Item prop="date">
                                            <i-input placeholder="">
                                                <span slot="prepend">经度</span>
                                            </i-input>
                                        </Form-Item>
                                    </i-col>
                                    <i-col span="1" style="text-align: center">-</i-col>
                                    <i-col span="11">
                                        <Form-Item prop="time">
                                            <i-input type="" placeholder="">
                                                <span slot="prepend">伟度</span>
                                            </i-input>
                                        </Form-Item>
                                    </i-col>
                                    <i-col span="1" style="text-align: center">-</i-col>
                                </i-row>
                            </Form-Item>


                            <Form-Item label="多行内容：">
                                <i-input placeholder="请输入" type="textarea"></i-input>
                            </Form-Item>


                            <Form-Item label="用户代码:">
                                <i-input placeholder="请输入"></i-input>
                            </Form-Item>


                            <Form-Item label="">
                                <i-button type="primary" size="large">保存</i-button>
                                <i-button type="default" size="large">取消</i-button>
                            </Form-Item>

                        </i-form>

                    </div>
                </div>

            </div>

        </div>


    </div>



    <script>
        new Vue({
            el: '#app',
            data: {
                visible: false,
                formCustom: {
                    pwd: '33'
                },
                formItem: {
                    input: 1,
                    select: 'shanghai'
                }
            },
            methods: {
                show: function() {
                    this.visible = true;
                }
            }
        })
    </script>



</body>

</html>